<template>
	<view class="all">
		<view class="top">
			<view class="flexc nav" style="position: relative;" >
				<view class="navli navliact">首页<view class="di"></view></view>
				<view class="navli" @click="quzhibo('/pages/test2/index')">轨迹</view>
				<!-- <view class="navli" @click="qudapaihang2">图文直播</view> -->
				<!-- <view class="navli" @click="shipinshow = true">视频</view> -->
				<view class="navli" v-if="xianshishui.app_open" @click="quzhibo('/pages/test2/index')">直播</view>
				
				<view class="navli" v-if="xianshishui.current_list_open" @click="qudapaihang">排行榜</view>
				<view class="navli" v-if="xianshishui.exceptional_list_open" @click="zhaoren('/pages/dashangbang/index')">打赏榜</view>
				<view class="navli" v-if="xianshishui.phototext_streaming_open" @click="qudapaihang2">动态</view>
				<!-- <view style="position: absolute;right: 38rpx; top:27rpx" @click="zhaoren('/pages/chazhaoxuanshou/index')"><image src="https://cdn.rockysports.cn/h5zhibo/hh10.png" style="width: 32rpx;height: 33rpx;"></image></view> -->
			</view>
		</view>
		<view class="dibu">
			<view class="dibubtn">您已报名，点击进入参赛中心</view>
		</view>
		<view class="con">
			<view style="padding: 20rpx 35rpx;">
				<view class="flex">
					<view><image src="../../static/assets/img/zubie1.png" style="width: 34rpx; height: 33rpx;"></image></view>
					<view style="margin-left: 18rpx; font-size: 14px; font-weight: bold;">2023第二届烟台女子马拉松</view>
				</view>
				<view style="color: #4F4F4F; font-size: 28rpx; margin-top: 15rpx;">2023.03.12 08:00-2023.03.18 21:00</view>
			</view>
			
			
			<view class="list">
				<view class="li" v-for="item in 3" :key="item">
					<view class="li_title">男子50KM越野组</view>
					<view class="licon">
						<view class="flexbc">
							<view class="flex">
								<view class="t1">距离</view>
								<view class="t2">50km</view>
							</view>
							<view class="flex">
								<view class="t1">距离</view>
								<view class="t2">50km</view>
							</view>
						</view>
						<view class="flexbc">
							<view>
								<view class="t1">起跑</view>
								<view class="t2">50km</view>
							</view>
							<view>
								<view class="t1">完赛</view>
								<view class="t2">50km</view>
							</view>
							<view>
								<view class="t1">未完成</view>
								<view class="t2">50km</view>
							</view>
						</view>
					</view>
					
				</view>
			</view>
		</view>
	</view>
	
</template>

<script>
	export default {
		name: 'index',
		data() {
			return {
				xianshishui:""
			}
		},
		onShow() {
			this.getlist()
		},
		methods: {
			getlist:function(){
				// api/app/signup_aide_detail_data
				//获取某人信息
				uni.$u.http.post(this.urlass + '/api/sport/api/app/signup_aide_detail_data', {
					apitoken: uni.getStorageSync('token'),
					id:11022285
				}).then(res => {
					if (res.data.msg.code == 0) {
						this.person2 = res.data.data
						this.show = true
					} else {
						this.$refs.uToast.show({
							message: res.data.msg.info,
							type: "error"
						})
					}
				})
			}
		}
	}
</script>

<style scoped lang="scss">
	.all{
		.dibu{ position: fixed; bottom: 0; left: 0; width: 100vw; display: flex; justify-content: center; align-items: center; padding: 78rpx; background: rgba(255, 255, 255, 0.8);
			.dibubtn{ background: #FF2A4D; color: #fff; border-radius: 40rpx; width: 530rpx; line-height: 80rpx; text-align: center;}
		}
		.con{ padding-top: 100rpx;
			.list{ padding: 15rpx;
				.li{ border-radius: 10rpx; box-shadow: 0px 0px 13rpx 0px rgba(0,0,0,0.07); overflow: hidden; margin-bottom: 20rpx;
					.li_title{ background: linear-gradient(270deg, #FFBC47 0%, #FF7A40 100%); line-height: 78rpx;  padding-left: 50rpx; font-size: 30rpx; font-weight: bold;}
					.licon{}
					.t1{ padding: 20rpx; color: #969696; font-size: 28rpx;}
					.t2{ padding: 20rpx; color: #333333; font-weight: bold; font-size: 32rpx;}
				}
			}
		}
		.top {
			position: fixed;
			z-index: 10;
			top: 0rpx;
			left: 0;
			width: 100%;
			// padding: 18rpx;
			.nav{
				height: 80rpx; background: rgba(255, 255, 255, 0.8); width: 100%;
				.navli{ width: 190rpx; text-align: center;display: flex;align-items: center;justify-content: center; font-size: 29rpx;position: relative;}
				.navliact{ font-weight: bold;}
				.di{ position: absolute;bottom: 0;left: 50%;margin-left: -19rpx;width: 38rpx;background: #FF5811;height: 5rpx;}
			}
		
			.dashang {
				background: rgba(0, 0, 0, 0.3);
				height: 96rpx;
				padding: 0 20rpx;
				border-radius: 96rpx;
				color: #fff;
		
				.image {
					position: relative;
					margin-right: 20rpx;
		
					.maozi {
						position: absolute;
						left: -15rpx;
						top: -25rpx;
		
						image {
							width: 45rpx;
							height: 45rpx
						}
					}
		
					.tx {
						image {
							width: 61rpx;
							height: 61rpx;
							border-radius: 61rpx;
							border: 3px #fff solid;
						}
					}
		
				}
			}
		
			.sr {
				background: rgba(0, 0, 0, 0.3);
				height: 67rpx;
				padding: 0 20rpx;
				border-radius: 2rpx;
				width: 300rpx;
				border-radius: 67rpx;
			}
		
			/deep/ .u-input {
				border: 0;
				padding: 0 !important;
		
			}
		
			/deep/ .u-input__content__field-wrapper__field {
				color: #FFFFFF !important;
				font-size: 12px !important;
			}
		}
	}
	
</style>